@charset "UTF-8";
body, nav, dl, dt, dd, p, h1, h2, h3, h4, ul, ol, li, input, button, textarea, footer {
    margin: 0;
    padding: 0
}
body,
mark,
option {
	color: #333
}

html {
	box-sizing: border-box;
	-webkit-tap-highlight-color: rgba(0, 0, 0, .1);
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	text-size-adjust: 100%
}

*,
:after,
:before {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
ul,ol{
	list-style: none;
}
body {
	background-color: #f3f3f3;
	font-size: 12px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Hiragino Sans GB", "Microsoft Yahei", Arial, Helvetica, STHeiti, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    -webkit-overflow-scrolling:touch;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 32px 0 0;
	font-weight: 600
}

h1 {
	font-size: 3.2rem
}

h2 {
	font-size: 2.6rem
}

h3 {
	font-size: 2.4rem
}

h4 {
	font-size: 2.2rem
}

h5 {
	font-size: 2rem
}

h6 {
	font-size: 1.8rem
}

a {
	color: #0080ff;
	text-decoration: none;
	-webkit-text-decoration-skip: objects
}
a,button,input,optgroup,select,textarea{
    -webkit-tap-highlight-color:rgba(0,0,0,0); /*去掉a、input和button点击时的蓝色外边框和灰色半透明背景*/
}
a, img {
    -webkit-touch-callout: none; /* 禁止长按链接与图片弹出菜单 */
}
b,
dt,
strong {
	font-weight: 600
}
img {
	width: 100%;
	height: auto;
	vertical-align: middle;
	border: 0;
}
button{
	border: 0;
}
a,
area,
button,
input,
label,
select,
summary,
textarea {
	outline: 0;
	-ms-touch-action: manipulation;
	touch-action: manipulation
}
table {
    border-collapse: collapse;
    border-spacing: 0
}
.clearfix:after {
	clear: both;
}

.clearfix:before,
.clearfix:after {
	display: table;
	content: " ";
}
.clear{clear:both;}
.send-word{
	width: 100%;
	height: 2.20rem;
	background: #ed304e;
	position: relative;
}

.send-word img{
	position: absolute;
	top: .1rem;
	left: 1.76rem;
	display: inline-block;
	width: 3.98rem;
	height: .37rem;
}
.word{
	position: absolute;
	bottom: 0;
	left: .15rem;
	width: 7.2rem;
	height: 1.6rem;
	border: 1px dashed #fff;
	border-radius: .15rem;
}
.word p{
	font-size: .24rem;
	padding: .15rem;
	text-indent: .54rem;
	line-height: .33rem;
	color: #fff;
}
.tk-lottery{
	height: 7.8rem;
	background: #ed304e;
	overflow: hidden;
}
.lottery-main{
	width: 7.2rem;
	height: 7.8rem;
	background: #f64e69;
	margin: .2rem auto;
	border-top-left-radius: 30px;
	border-top-right-radius: 30px;
	text-align: center;
	overflow: hidden;
}
.lottery-main span{
	display: block;
	background-image: url(../img/lottery_title.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
	width: 4.27rem;
	height: .32rem;
	margin: .26rem auto .15rem;
}
.lottery-main p{
	font-size: .24rem;
	color: #fff;
}
.lottery-main p em{
	font-size: .30rem;
	padding: 0 2px;
	color: #ffd147;
	font-style: normal;
}
.lottery{
	position: relative;
	background: #390216;
	width: 6.25rem;
	height: 6.25rem;
	border-radius: 10px;
	margin: .1rem auto;
}
.lottery table td {
	position: relative;
	width: 1.95rem;
	background: #390216;
	text-align: center;
	color: #333;
	border: .1rem solid #390216;
}
.lottery-table {
	position: absolute;
	top: .18rem;
	left: .14rem;
}
.lottery table td.active .mask {
	display: block;
}
.mask {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background-color: rgba(255, 255, 255, 0.2);
	display: none;
	border-radius: 15px;
}

.lottery-list-title span{
	display: block;
	background: url(../img/wining_list.jpg) no-repeat;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
	width: 100%;
	height: .87rem;
}
.lottery-list{
	height: 7.1rem;
	background: #ffa63d;
	overflow: hidden;
}
.list-bg{
	width: 7.2rem;
	background: #ffba68;
	margin: 0 auto;
	overflow: hidden;
}
.lucky-list{
	position: relative;
	width: 6.25rem;
	height: 3.2rem;
	background: #fff;
	border-radius: 10px;
	margin: .24rem auto;
	overflow: hidden;
}
.lucky-list img{
	position: absolute;
	top: .05rem;
	left: 0;
}
.topRec_List{
	width: 6rem;
	margin: .5rem auto;
}
.topRec_List dl,.maquee{ overflow:hidden; margin:0 auto; color:#aaa}
.topRec_List dl dd{
	display: inline;
	float: left;
	width: 6rem;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	font-size: 14px;
	text-align: center;
	color:#F26980;
}
.topRec_List dl dd:nth-child(1){ 
	width:17%; 
	height:.4rem; 
	line-height:.4rem; 
}
.topRec_List dl dd:nth-child(2){ 
	width:38%; 
	height:.4rem; 
	line-height:.4rem; 
}
.topRec_List dl dd:nth-child(3){ 
	width:45%; 
	height:.4rem; 
	line-height:.4rem; 
}
.topRec_List ul{ 
	width:100%; 
	height:2.3rem;
}
.topRec_List li{ 
	width:100%; 
	height:.38rem; 
	line-height:.38rem; 
	text-align:center; 
	font-size:12px; 
	color: #1A0033;
	border-bottom: 1px dashed #aaa;
}
.topRec_List li div{ 
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	float:left;
}
.topRec_List li div:nth-child(1){ width:17%;}
.topRec_List li div:nth-child(2){ width:38%;}
.topRec_List li div:nth-child(3){ width:45%;}
.explain {
	background: #ed304e;
	overflow: hidden;
}
.explain span{
	display: block;
	background: url(../img/footer_title.jpg) no-repeat;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
	height: 1.4rem;
}
.explain-p{
	width: 7.2rem;
	background: #f64e69;
	border-radius: 15px;
	margin: .2rem auto;
	padding: .15rem;
}
.explain-p p{
	font-size: 12px;
	line-height: .34rem;
	color: #fff;
}
.explain-p p em{
	font-size: 13px;
	font-style: normal;
	font-weight: bold;
}
.modal-dialog{
	position: fixed;
	top: .5rem;
	left: 0;
	background: url(../img/dialog_bg.png) 0 0 no-repeat;
	-webkit-background-size: 100% auto;
	background-size: 100% auto;
	width: 7.5rem;
	height: 9.96rem;
	
	z-index: 11;
	display: none;
}
.modal-dialog .dialog-tip{
	font-size: 16px;
	color: #fff;
	margin: 2.6rem auto;
	text-align: center;
}
.dialog-tip em{
	font-size: 18px;
	font-style: normal;
	color: #fff9a4;
}
.dialog-content{
	position: absolute;
	top: 3.8rem;
	left: 2.35rem;
}
.dialog-content img{
	display: inline-block;
	width: 2.8rem;
	height: 2.8rem;
}
.btn-ok{
	position: absolute;
	bottom: 1.2rem;
	left: 2.55rem;
	width: 2.5rem;
	height: .85rem;
	background: #fb3345;
	border-radius: 30px;
	text-align: center;
}

.btn-ok .qd{
	display: inline-block;
	color: #fff;
	font-size: 18px;
	line-height: .85rem;
}

.close {
    position: absolute;
	right: .8rem;
	top:1.3rem;
	width: .5rem;
	height: .5rem;
    font-size: 28px;

    line-height: 1;
    color: #fff;
    background: transparent;
    cursor: pointer;
    border: 1px solid #fff;
    border-radius: 50%;
}
.prize-opacity {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0,0,0,0.45);
	z-index: 10;
	display: none;
}


/* 提示弹出框  */
.modal-dialog-tip{
	position: fixed;
	top: 3rem;
	left: .75rem;
	background: #fff;
	width: 6rem;
	border-radius: 10px;
	box-shadow: 0px 0px 8px #ECECEC!important;
	z-index: 11;
	display: none;
}
.modal-dialog-tip .dialog-content-tip .tip-dialog{
	font-size: 14px;
	color: #787878;
	padding:.2rem .3rem 0 .3rem ; 
}
.modal-dialog-tip .dialog-content-tip h3{
	font-size: 16px;
	font-weight: normal;
	color: #444;
	padding: .1rem .2rem;
	margin: 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.1);
	text-align: left;
}

.modal-dialog-tip .btn-know .iknow{
	display: block;
	padding: .1rem .2rem;
	color: #2980b9;
	font-size: 16px;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
	margin-top: .2rem;
	text-align: center;
	
}
.modal-dialog-tip .btn-know .iknow:active {
    background-color: whitesmoke; 
    border-top: 1px solid #2980b9;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

.modal-dialog-tip .tip-close {
    position: absolute;
	right: .2rem;
	top:.1rem;
    font-size: 22px;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: .2;
    -webkit-appearance: none;
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0;
}
.modal-dialog-tip .tip-close:active{
	opacity: .4;
}


.animated {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both
}

@-webkit-keyframes bounceIn {
	0%,
	20%,
	50%,
	80%,
	to {
		-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		animation-timing-function: cubic-bezier(.215, .61, .355, 1)
	}
	0% {
		opacity: 0;
		-webkit-transform: scale3d(.3, .3, .3);
		transform: scale3d(.3, .3, .3)
	}
	20%{
		-webkit-transform: scale3d(.6, .6, .6);
		transform: scale3d(.6, .6, .6)
	}
	50% {
		-webkit-transform: scale3d(1.2, 1.2, 1.2);
		transform: scale3d(1.2, 1.2, 1.2)
	}
	80% {
		opacity: 1;
		-webkit-transform: scale3d(.9, .9, .9);
		transform: scale3d(.9, .9, .9)
	}
	to {
		opacity: 1;
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
}

@keyframes bounceIn {
	0%,
	50%,
	80%,
	to {
		-webkit-animation-timing-function: cubic-bezier(.215, .61, .355, 1);
		animation-timing-function: cubic-bezier(.215, .61, .355, 1)
	}
	0% {
		opacity: 0;
		-webkit-transform: scale3d(.3, .3, .3);
		transform: scale3d(.3, .3, .3)
	}
	50% {
		-webkit-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1)
	}
	80% {
		opacity: 1;
		-webkit-transform: scale3d(.9, .9, .9);
		transform: scale3d(.9, .9, .9)
	}
	to {
		opacity: 1;
		-webkit-transform: scaleX(1);
		transform: scaleX(1)
	}
}

.bounceIn {
	-webkit-animation-name: bounceIn;
	animation-name: bounceIn
}
@-webkit-keyframes zoomOut {
	0% {
		opacity: 1
	}
	50% {
		-webkit-transform: scale3d(.3, .3, .3);
		transform: scale3d(.3, .3, .3)
	}
	to {
		opacity: 0
	}
}

@keyframes zoomOut {
	0% {
		opacity: 1
	}
	50% {
		-webkit-transform: scale3d(.3, .3, .3);
		transform: scale3d(.3, .3, .3)
	}
	to {
		opacity: 0
	}
}

.zoomOut {
	-webkit-animation-name: zoomOut;
	animation-name: zoomOut
}